<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title></title>
    <link rel="stylesheet" type="text/css" href="../../css/mui.min.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/html-base.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/public-train.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/train-index.css"/>
    <style type="text/css">
    	.rotation-img{
    		width: 100%;
			height: 56vw;
    		display: block;
			object-fit: cover;
    	}
    	.no-data-div{
    		padding: 0.5rem 2rem;
    	}
    	.no-data-img{
    		width: 100%;
    	}
    	.no-data-p{
    		font: 0.2rem;
    		text-align: center;
    		color: #999;
    		line-height: 0.2rem;
    	}
    </style>
    <script type="text/javascript" src="../../script/newresize.js"></script>
</head>
<body>
	<div class="bancont">
		<div id="slider" class="mui-slider">
			<div id="rotation" class="mui-slider-group mui-slider-loop">
				<!-- <div class="mui-slider-item">
                    <a href="#">
                        <img src="../../image/default-pic02.png">
                    </a>
                </div>
                <div class="mui-slider-item">
                    <a href="#">
                        <img src="../../image/default-pic02.png">
                    </a>
                </div> -->
			</div>
			<div id="noRotation" hidden="hidden">
				<div class="rotation-cell">
					<!-- <a href="#"> -->
						<img class="rotation-img" style="display: block;" src="../../image/default-pic02.png">
					<!-- </a> -->
				</div>
			</div>
			<div id="pageControl" class="mui-slider-indicator">
                <!-- <div class="mui-indicator mui-active"></div>
                <div class="mui-indicator"></div> -->
            </div>
		</div>
	</div>
	<div class="navcontainer">
		<ul class="navwrapper">
			<li index="1" class="active"><a href="javascript:;">师资培训</a></li>
			<li index="2"><a href="javascript:;">双创培训</a></li>
			<li index="3"><a href="javascript:;">前沿培训</a></li>
			<li index="4"><a href="javascript:;">实践教学</a></li>
		</ul>
	</div>
	<div class="maincontainer">
		<div class="list-title">
			<span>最新培训</span>
			<a id="train_more" href="javascript:;" onclick="trainMoreClick()" class="morelistbtn" hidden="hidden">更多&gt;</a>
		</div>
		<div class="listwrapper">
			<ul id="train_list" class="listbox">
				<!-- <li>
					<a href="javascript:;">
						<div class="u-img"><img src="../../image/default-pic01.png"/></div>
						<div class="u-txt">
							<h3>货运代理师资培训班</h3>
							<p>本培训将线上和线下，理论知识和专业技能有机结合在一起，并平结合在一起，并平</p>
							<div><p class="marktxt">2018-12-15</p> <span class="pricetxt">￥12800.00</span></div>
						</div>
					</a>
				</li>
				<li>
					<a href="javascript:;">
						<div class="u-img"><img src="../../image/default-pic01.png"/></div>
						<div class="u-txt">
							<h3>货运代理师资培训班</h3>
							<p>本培训将线上和线下，理论知识和专业技能有机结合在一起，并平结合在一起，并平</p>
							<div><p class="marktxt">2018-12-15</p> <span class="pricetxt">￥12800.00</span></div>
						</div>
					</a>
				</li> -->
			</ul>
			<div id="train_no_data" class="no-data-div">
				<div>
					<img class="no-data-img" src="../../image/default-pic03.png">
					<p class="no-data-p">暂无数据</p>
				</div>
			</div>
		</div>
		<div class="list-title">
			<span>热门课程</span>
			<a id="course_more" href="javascript:;" onclick="courseMoreClick()" class="morelistbtn" hidden="hidden">更多&gt;</a>
		</div>
		<div class="listwrapper">
			<ul id="course_list" class="listbox listbox2">
				<!-- <li>
					<a href="javascript:;">
						<div class="u-img"><img src="../../image/default-pic01.png"/></div>
						<div class="u-txt">
							<h3>挡不住的跨境电商时代</h3>
							<p class="starbox">
								<span class="icon-star icon-star-on"></span>
								<span class="icon-star icon-star-on"></span>
								<span class="icon-star icon-star-on"></span>
								<span class="icon-star"></span>
								<span class="icon-star"></span>
							</p>
							<p>本培训将线上和线下，理论知识和专业技能有机结合在一起，并平结合在一起，并平</p>
							<div><p class="marktxt">祁振国  17课时</p> <span class="pricetxt">￥380.00</span></div>
						</div>
					</a>
				</li>
				<li>
					<a href="javascript:;">
						<div class="u-img"><img src="../../image/default-pic01.png"/></div>
						<div class="u-txt">
							<h3>挡不住的跨境电商时代</h3>
							<p class="starbox">
								<span class="icon-star icon-star-on"></span>
								<span class="icon-star icon-star-on"></span>
								<span class="icon-star icon-star-on"></span>
								<span class="icon-star icon-star-on"></span>
								<span class="icon-star"></span>
							</p>
							<p>本培训将线上和线下，理论知识和专业技能有机结合在一起，并平结合在一起，并平</p>
							<div><p class="marktxt">祁振国  17课时</p> <span class="pricetxt">￥380.00</span></div>
						</div>
					</a>
				</li> -->
			</ul>
			<div id="course_no_data" class="no-data-div">
				<div>
					<img class="no-data-img" src="../../image/default-pic03.png">
					<p class="no-data-p">暂无数据</p>
				</div>
			</div>
		</div>
		<div class="list-title">
			<span>近期培训报道</span>
			<a id="jqpx_more" href="javascript:;" onclick="jqpxMoreClick()" class="morelistbtn">更多&gt;</a>
		</div>
		<div class="listwrapper">
			<ul id="jqpx_list" class="listbox">
				<!-- <li>
					<a href="javascript:;">
						<div class="u-img"><img src="../../image/default-pic01.png"/></div>
						<div class="u-txt">
							<h3>产学合作协同育人”之大数...</h3>
							<p>本培训将线上和线下，理论知识和专业技能有机结合在一起，并平结合在一起，并平</p>
							<div><p class="marktxt">2018-12-13至2018-12-14</p></div>
						</div>
					</a>
				</li>
				<li>
					<a href="javascript:;">
						<div class="u-img"><img src="../../image/default-pic01.png"/></div>
						<div class="u-txt">
							<h3>产学合作协同育人”之大数...</h3>
							<p>本培训将线上和线下，理论知识和专业技能有机结合在一起，并平结合在一起，并平</p>
							<div><p class="marktxt">2018-12-13至2018-12-14</p></div>
						</div>
					</a>
				</li> -->
			</ul>
			<div id="jqpx_no_data" class="no-data-div">
				<div>
					<img class="no-data-img" src="../../image/default-pic03.png">
					<p class="no-data-p">暂无数据</p>
				</div>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/jquery.min.js"></script>
<script type="text/javascript" src="../../script/mui.min.js"></script>
<script type="text/javascript" src="../../script/MD5.js"></script>
<script type="text/javascript" src="../../script/requestTool.js"></script>
<script type="text/javascript" src="../../script/timeStampTool.js"></script>
<script type="text/javascript">
	var category_id = 113;
	var rotationArr = new Array();//轮播图
	var trainArr1 = new Array();//最新培训1
	var trainArr2 = new Array();//最新培训2
	var trainArr3 = new Array();//最新培训3
	var trainArr4 = new Array();//最新培训4
	var trainNum1 = 0;
	var trainNum2 = 0;
	var trainNum3 = 0;
	var trainNum4 = 0;
	var courseArr1 = new Array();//热门课程1
	var courseArr2 = new Array();//热门课程2
	var courseArr3 = new Array();//热门课程3
	var courseArr4 = new Array();//热门课程4
	var courseNum1 = 0;
	var courseNum2 = 0;
	var courseNum3 = 0;
	var courseNum4 = 0;
	var newsArr = new Array()//近期培训报道
	var train_type = 1;//默认师资培训
	var jqpxArr = new Array();//近期培训
	var trainShowMore = false;//默认未显示全部
	var courseShowMore = false;//默认未显示全部
	var jqpxShowMore = false;//默认未显示全部
	$(function(){
		$(".navwrapper li").on("click",function(){
			$(".navwrapper li").removeClass("active");
			$(this).addClass("active");
			train_type = $(this).attr('index');
			var index = train_type - 1;
			api.setFrameGroupIndex({
				name : 'newTrainFrameGroup',
				index : 1
			});
			api.setFrameGroupIndex({
				name : 'NewTrain_winFrameGroup',
				index : index
			});
			api.setFrameGroupAttr({
			    name: 'NewTrain_winFrameGroup',
			    hidden: false
			});
			// var courseArr = currentCourseArr();
			// if (courseArr.length == 0) {
			// 	loadCouData();
			// 	loadPXData();
			// }else{
			// 	setupCourseData();
			// 	setupTrainData();
			// }
		})
	})
	apiready = function(){
	    loadData();
	}
	function loadData(){
		loadLunBoData();
		loadPXData();
		loadCouData();
		loadJinQiPeiXun();
	}
	//加载轮播数据
	function loadLunBoData(){
		var params = {
			category_id : category_id,
			news_tag : 5,//传4时为轮播图
			page : 1, 
			rows : 10
		};
		// console.log(JSON.stringify(params)+'\n'+url_train_getNewsList);
		cfnetppPOST(url_train_getNewsList, params, true, function(data, status){
			if (status == 'success') {
				if (data.code == 200) {
					var news = data.data.data;
					if (news != undefined && news != null && news.constructor == Array && news.length > 0) {
						rotationArr = news;
						setupRotationData();
					}
				}
			}
		});
	}
	//设置轮播图数据
	function setupRotationData(){
		if (rotationArr.length == 1) {
			var rotationHtml = '';
			rotationHtml = noRotationHtmlString(0, rotationArr[0]);
			$('#noRotation').html(rotationHtml);
			$('#noRotation').show();
			$('#rotation').hide();
		}else{
			var rotationHtml = '';
			//额外增加的一个节点(循环轮播：第一个节点是最后一张轮播)
			var lastIndex = rotationArr.length - 1;
			var rotationLastData = rotationArr[lastIndex];
			rotationHtml += firstLastImgHtml(lastIndex, rotationLastData);
			//遍历数组
			for (var i = 0; i < rotationArr.length; i++) {
				var rotationData = rotationArr[i];
				rotationHtml += rotationHtmlString(i, rotationData);
			}
			//额外增加的一个节点(循环轮播：最后一个节点是第一张轮播)
			var firstIndex = 0;
			var rotationFirstData = rotationArr[firstIndex];
			rotationHtml += firstLastImgHtml(firstIndex, rotationFirstData);
			//设置轮播图代码
			$('#rotation').html(rotationHtml);
			//设置page Control
			$('#pageControl').html(pageControlHtml(rotationArr.length));
			//设置自动轮播
			setupAutoRotation();
			$('#noRotation').hide();
			$('#rotation').show();
		}
		//设置轮播图点击事件
		setupRotationCellClick();
	}
	function setupRotationCellClick(){
		$('.rotation-cell').unbind('click');
		$('.rotation-cell').click(function(event) {
			if (api.connectionType == "none") {
				api.toast({
				    msg: '网络异常，请检查网络！'
				});
				return;
			}
			var index = $(this).attr('index');
			var rotationData = rotationArr[parseInt(index)];
			rotationData['detail'] = rotationData.news_url;
			if (rotationData.detail != null && rotationData.detail != '') {
				api.openWin({useWKWebView:true,
				    name: 'Teacher_TrainNewsDetail',
				    url: '../Teacher_Teach/Teacher_TrainNewsDetail.html',
				    pageParam: rotationData
				});
			}
		});
	}
	//分页html
	function pageControlHtml(count){
		var pageControl = '';
		pageControl += '<div class="mui-indicator mui-active"></div>';
		for (var i = 1; i < count; i++) {
			pageControl += '<div class="mui-indicator"></div>';
		}
		return pageControl;
	}
	//轮播图首尾
	function firstLastImgHtml(index, data){
		return '<div index="'+index+'" class="rotation-cell mui-slider-item mui-slider-item-duplicate">'+
					'<a href="#">'+
						'<img class="rotation-img" src="'+data.news_img+'">'+
					'</a>'+
				'</div>';
	}
	//轮播图
	function rotationHtmlString(index, data){
		return '<div index="'+index+'" class="rotation-cell mui-slider-item">'+
					'<a href="#">'+
						'<img class="rotation-img" src="'+data.news_img+'">'+
					'</a>'+
				'</div>';
	}
	//不轮播的cell
	function noRotationHtmlString(index, data){
		return '<div index="'+index+'" class="rotation-cell">'+
					'<img class="rotation-img" style="display: block;" src="'+data.news_img+'">'+
				'</div>';
	}
	function setupAutoRotation(){
		mui.init();
		var slider = mui("#slider");
		slider.slider({
			interval: 3000
		});
	}
	function loadPXData(){
		loadPeiXunData1();
		// loadPeiXunData2();
		// loadPeiXunData3();
		// loadPeiXunData4();
	}
	function loadPeiXunData1(){
		loadPeiXunData(1, function(status, arr, num){
			if (status == true) {
				trainArr1 = arr;
				trainNum1 = num;
				setupTrainData();
			}
		});
	}
	function loadPeiXunData2(){
		loadPeiXunData(2, function(status, arr, num){
			if (status == true) {
				trainArr2 = arr;
				trainNum2 = num;
				setupTrainData();
			}
		});
	}
	function loadPeiXunData3(){
		loadPeiXunData(3, function(status, arr, num){
			if (status == true) {
				trainArr3 = arr;
				trainNum3 = num;
				setupTrainData();
			}
		});
	}
	function loadPeiXunData4(){
		loadPeiXunData(4, function(status, arr, num){
			if (status == true) {
				trainArr4 = arr;
				trainNum4 = num;
				setupTrainData();
			}
		});
	}
	//加载培训数据
	function loadPeiXunData(type, callback){
		train_type=type;
		var params = {
			// train_type : train_type,
			page : 1,
			rows : 10
		};

		// console.log(JSON.stringify(params)+'\n'+url_train_getClassList);
		cfnetppPOST(url_train_getNewClassList, params, true, function(data, status){
			if (status == 'success') {
				if (data.code == 200) {
					var trains = data.data.data;
					var num = data.data.num;
					if (trains != undefined && trains != null && trains.constructor == Array && trains.length > 0) {
						if (callback) {
							callback(true, trains, num);
						}
					}else{
						if (callback) {
							callback(false, null, 0);
						}
					}
				}else{
					if (callback) {
						callback(false, null, 0);
					}
				}
			}
		});
	} 
	function setupTrainData(){
		var trainNum = currentTrainNum();
		if (trainNum == 0) {
			$('#train_no_data').show();
		}else{
			$('#train_no_data').hide();
		}
		if (trainNum > 2) {
			$('#train_more').show();
		}else{
			$('#train_more').hide();
		}
		var trainArr = currentTrainArr();
		var length = trainArr.length;
		if (trainShowMore == false && length > 2) {
			length = 2;
		}
		var trainHtml = '';
		for (var i = 0; i < length; i++) {
			var trainData = trainArr[i];
			trainHtml += trainCellHtml(i, trainData);
		}
		$('#train_list').html(trainHtml);
		setupTrainCellClick();
	}
	function setupTrainCellClick(){
		$('.train-cell').unbind('click');
		$('.train-cell').click(function(event) {
			var index = $(this).attr('index');
			var trainArr = currentTrainArr();
			var trainData = trainArr[parseInt(index)];
			api.openWin({useWKWebView:true,
			    name: 'train-det-px',
			    url: 'train-det-px.html',
			    pageParam: trainData
			});
		});
	}
	function trainCellHtml(index, data){
		return '<li index="'+index+'" class="train-cell">'+
					'<a href="javascript:;">'+
						'<div class="u-img"><img src="'+data.class_image+'"/></div>'+
						'<div class="u-txt">'+
							'<h3>'+data.class_name+'</h3>'+
							'<p>'+data.train_brief+'</p>'+
							'<div><p class="marktxt">'+timeStringWithTimeStamp(data.record_start_time)+'</p> <span class="pricetxt">￥'+data.train_fee+'</span></div>'+
						'</div>'+
					'</a>'+
				'</li>';
	}
	//加载热门课程
	function loadCourseData(type, callback){
		var params = {
			// train_type : type,
			page : 1, 
			rows : 10
		};
		console.log("");
		// console.log(JSON.stringify(params)+'\n'+url_train_getCourseList);
		cfnetppPOST(url_train_getCourseList, params, true, function(data, status){
			if (status == 'success') {
				if (data.code == 200) {
					var courses = data.data.data;
					var num = data.data.num;
					if (courses != undefined && courses != null && courses.constructor == Array && courses.length > 0) {
						if (callback) {
							callback(true, courses, num);
						}
					}else{
						if (callback) {
							callback(false, null, 0);
						}
					}
				}else{
					if (callback) {
						callback(false, null, 0);
					}
				}
			}else{
				api.toast({
				    msg: '网络异常，请检查网络！'
				});
			}
		});
	}
	function loadCouData(){
		loadCourseData1();
		// loadCourseData2();
		// loadCourseData3();
		// loadCourseData4();
	}
	function loadCourseData1(){
		loadCourseData(1, function(status, courses, num){
			if (status == true) {
				courseArr1 = courses;
				courseNum1 = num;
				setupCourseData();
			}
		});
	}
	function loadCourseData2(){
		loadCourseData(2, function(status, courses, num){
			if (status == true) {
				courseArr2 = courses;
				courseNum2 = num;
				setupCourseData();
			}
		});
	}
	function loadCourseData3(){
		loadCourseData(3, function(status, courses, num){
			if (status == true) {
				courseArr3 = courses;
				courseNum3 = num;
				setupCourseData();
			}
		});
	}
	function loadCourseData4(){
		loadCourseData(4, function(status, courses, num){
			if (status == true) {
				courseArr4 = courses;
				courseNum4 = num;
				setupCourseData();
			}
		});
	}
	function setupCourseData(){
		var courseArr = currentCourseArr();
		var courseNum = currentCourseNum();
		if (courseNum == 0) {
			$('#course_no_data').show();
		}else{
			$('#course_no_data').hide();
		}
		if (courseNum > 2) {
			$('#course_more').show();
		}else{
			$('#course_more').hide();
		}
		var length = courseArr.length;
		if (courseShowMore == false && length > 2) {
			length = 2;
		}
		var courseHtml = '';
		for (var i = 0; i < length; i++) {
			var courseData = courseArr[i];
			courseHtml += courseCellHtml(i, courseData);
		}
		$('#course_list').html(courseHtml);
		setupCourseCellClick();
	}
	function currentCourseNum(){
		var courseNum = courseNum1;
		if (train_type == 2) {
			courseNum = courseNum2;
		}else if(train_type == 3){
			courseNum = courseNum3;
		}else if(train_type == 4){
			courseNum = courseNum4;
		}
		return courseNum;
	}
	function currentCourseArr(){
		var courseArr = courseArr1;
		if (train_type == 2) {
			courseArr = courseArr2;
		}else if(train_type == 3){
			courseArr = courseArr3;
		}else if(train_type == 4){
			courseArr = courseArr4;
		}
		return courseArr;
	}
	function currentTrainNum(){
		var trainNum = trainNum1;
		if (train_type == 2) {
			trainNum = trainNum2;
		}else if(train_type == 3){
			trainNum = trainNum3;
		}else if(train_type == 4){
			trainNum = trainNum4;
		}
		return trainNum;
	}
	function currentTrainArr(){
		var trainArr = trainArr1;
		if (train_type == 2) {
			trainArr = trainArr2;
		}else if(train_type == 3){
			trainArr = trainArr3;
		}else if(train_type == 4){
			trainArr = trainArr4;
		}
		return trainArr;
	}
	//课程点击事件
	function setupCourseCellClick(){
		$('.course-cell').unbind('click');
		$('.course-cell').click(function(){
			var courseArr = currentCourseArr();
			var index = parseInt($(this).attr('index'));
			var courseData = courseArr[index];
			api.openWin({useWKWebView:true,
			    name: 'train-det-kc',
			    url: 'train-det-kc.html',
			    pageParam: courseData
			});
		});
	}
	function courseCellHtml(index, data){
		var star_num = data.star_num;
		return '<li index="'+index+'" class="course-cell">'+
					'<a href="javascript:;">'+
						'<div class="u-img"><img src="'+data.course_image+'"/></div>'+
						'<div class="u-txt">'+
							'<h3>'+data.course_name+'</h3>'+
							'<p class="starbox">'+
								starHtml(star_num)+
							'</p>'+
							'<p>'+data.course_describe+'</p>'+
							'<div><p class="marktxt">'+data.teachername+'  '+data.course_period+'课时</p> <span class="pricetxt">￥'+data.course_fee+'</span></div>'+
						'</div>'+
					'</a>'+
				'</li>';
	}
	//星星字符串
	function starHtml(num){
		num1 = 5 - num;
		var starHtmlStr = '';
		for (var i = 0; i < num; i++) {
			starHtmlStr += starOnHtml();
		}
		for (var i = 0; i < num1; i++) {
			starHtmlStr += starOffHmtl();
		}
		return starHtmlStr;
	}
	//选中的星星
	function starOnHtml(){
		return '<span class="icon-star icon-star-on"></span>';
	}
	//未选中的星星
	function starOffHmtl(){
		return '<span class="icon-star"></span>';
	}
	//加载近期培训数据
	function loadJinQiPeiXun(){
		var params = {
			category_id : category_id,
			news_tag : 0,//传0时为近期培训
			page : 1, 
			rows : 10
		};
		// console.log(JSON.stringify(params)+'\n'+url_train_getNewsList);
		cfnetppPOST(url_train_getNewsList, params, true, function(data, status){
			if (status == 'success') {
				if (data.code == 200) {
					var news = data.data.data;
					var num = data.data.num;
					if (num > 2) {
						$('#jqpx_more').show();
					}else{
						$('#jqpx_more').hide();
					}
					if (news != undefined && news != null && news.constructor == Array && news.length > 0) {
						jqpxArr = news;
						setupJqpxData();
					}
				}
			}
		});
	}
	function setupJqpxData(){
		var length = jqpxArr.length;
		if (length == 0) {
			$('#jqpx_no_data').show();
		}else{
			$('#jqpx_no_data').hide();
		}
		if (jqpxShowMore == false && length > 2) {
			length = 2;
		}
		var htmlString = '';
		for (var i = 0; i < length; i++) {
			var trainData = jqpxArr[i];
			htmlString += jqpxCellHtml(i, trainData);
		}
		$('#jqpx_list').html(htmlString);
		setupJqpxCellClick();
	}
	function setupJqpxCellClick(){
		$('.jqpx-cell').unbind('click');
		$('.jqpx-cell').click(function(){
			var index = parseInt($(this).attr('index'));
			var trainData = jqpxArr[index];
			if (api.connectionType == "none") {
				api.toast({
				    msg: '网络异常，请检查网络！'
				});
				return;
			}
			trainData['detail'] = trainData.news_url;
			if (trainData.detail != null && trainData.detail != '') {
				api.openWin({useWKWebView:true,
				    name: 'Teacher_TrainNewsDetail',
				    url: '../Teacher_Teach/Teacher_TrainNewsDetail.html',
				    pageParam: trainData
				});
			}
		});
	}
	function jqpxCellHtml(index, data){
		return '<li index="'+index+'" class="jqpx-cell">'+
					'<a href="javascript:;">'+
						'<div class="u-img"><img src="'+data.news_img+'"/></div>'+
						'<div class="u-txt">'+
							'<h3>'+data.news_title+'</h3>'+
							'<p>'+data.news_description+'</p>'+
							'<div><p class="marktxt">'+timeStringWithTimeStamp(data.createtime)+'</p></div>'+
						'</div>'+
					'</a>'+
				'</li>';
	}
	function trainMoreClick(){
		trainShowMore = !trainShowMore;
		setupTrainData();
	}
	function courseMoreClick(){
		courseShowMore = !courseShowMore;
		setupCourseData();
	}
	function jqpxMoreClick(){
		jqpxShowMore = !jqpxShowMore;
		setupJqpxData();
	}
</script>
</html>